{* $Id$ *}
{include_core file="admin/lib/header.html" title="播放单管理"}
<div class="page-header border-bottom clearfix">
  <h2 class="left">播放单管理<span>添加素材</span></h2>
  <a href="{AnUrl('play_list/admin')}" class="btn btn-default btn-sm right">&lt;&nbsp;返回播放单列表</a>
</div>

<div class="add-form">
    <table class="table" cellpadding="0" cellspacing="0">
      <tr>
        <th><label for="" class="add-f-label">播放单名：</label></th>
        <td>
          {$info.title}
        </td>
      </tr>
      <tr>
        <th><label for="" class="add-f-label">播放地址：</label></th>
        <td>
          {if $info.province}{$info.province}{$info.city}{else}全国{/if}
        </td>
      </tr>
      <tr>
        <th><label for="" class="add-f-label">播放时间：</label></th>
        <td>
          {time_format($info.start_time)} 至 {time_format($info.stop_time)}
        </td>
      </tr>
    </table>

    <p>在播放单中素材：</p>
    <span class='js_save_sort hidden'><a href="{AnUrl('play_list/admin/save_sort')}" play-list-id="{$info.id}" class="btn btn-success btn-xs right">保存排序</a></span>
    <table class="list-table goods-table js_table">
    <thead>
      <tr>
        <th style="width:100px;text-align:left;">素材名</th>
        <th style="width:80px;text-align:left;">素材</th>
        <th style="width:20px;text-align:left;">类型</th>
        <th style='width:20px;text-align:left;'>停留时间</th>
        <th style='width:130px;text-align:left;'>播放地区</th>
        <th style='text-align:left;'>操作</th>
      </tr>
    </thead>
    <tbody class="js_sort">
        {foreach $play_material_list as $k=>$v}
          <tr id="dataList{$v.id}">
              <td>{$v.title}</td>
              <td>{if $v.type == 1}<img src="{_image($v.path, 'small')}">{else}{$v.path}{/if}</td>
              <td>{if $v.type == 1}图片{else}视频{/if}</td>
              <td>{$v.stop_time}(秒)</td>
              <td>{if $v.province}{$v.province}{$v.city}{else}全国{/if}</td>
              <td>
                <a href='{AnUrl("play_list/admin/do_add_material")}' class="btn btn-danger btn-xs js_add" play-list-id="{$info.id}" material-id="{$v.id}" is-delete=1><i class="icon-trash icon-white"></i>移除</a>
              </td>
          </tr>
        {foreachelse}
          <tr>
            <td colspan='7'>暂无数据</td>
          </tr>
        {/foreach}
    </tbody>
  </table>
<br />
<!-- <p>不在播放单中素材：</p> -->
<div class='js_location'>
  <div><label for="" class="add-f-label">播放地址：</label></div>
  <form action='{AnUrl("play_list/admin/add_material")}' method='get' class='js_search'>
    <input type='hidden' name='id' value="{$info.id}" />
      <div>
        {$province_list = material_helper::get_province(0, 1)}{* 省列表 *}
          <select class="add-f-slt1 js_province" name="search_info[province]">
            <option value="全部" code='-1'>全部</option>
            <option value="全国" code='0' {if $search_info.province == '全国'}selected{/if}>全国</option>
            {foreach $province_list as $k=>$v}
                <option value="{$v.area}" {if $search_info.province == $v.area}selected{/if} code="{$v.id}">{$v.area}</option>
            {/foreach}
          </select>
          <select class="add-f-slt1 js_city" name="search_info[city]">
            {if $search_info.city}<option value="{$search_info.city}">{$search_info.city}</option>{else}<option value="">全部</option>{/if}
          </select>
          <a class="btn btn-success btn-xs js_searchBtn">查询</a>
      </div>
    </form>
</div>
    <table class="list-table goods-table">
    <thead>
      <tr>
        <th style="width:20px;text-align:left;"><input type="checkbox" class="selectAll"></th>
        <th style="width:100px;text-align:left;">素材名</th>
        <th style="width:80px;text-align:left;">素材</th>
        <th style="width:20px;text-align:left;">类型</th>
        <th style='width:20px;text-align:left;'>停留时间</th>
        <th style='width:130px;text-align:left;'>播放地区</th>
      </tr>
    </thead>
    <tbody>
        {foreach $material_list as $k=>$v}
          <tr id="dataList{$v.id}">
              <td><input type="checkbox" class="listSelect"></td>
              <td>{$v.title} {if in_array($v.id, $play_material_ids)}<span style='color:red'>已在播放单内</span>{/if}</td>
              <td>{if $v.type == 1}<img src="{_image($v.path, 'small')}">{else}{$v.path}{/if}</td>
              <td>{if $v.type == 1}图片{else}视频{/if}</td>
              <td>{$v.stop_time}(秒)</td>
              <td>{if $v.province}{$v.province}{$v.city}{else}全国{/if}</td>
          </tr>
        {foreachelse}
          <tr>
            <td colspan='7'>暂无数据</td>
          </tr>
        {/foreach}
    </tbody>
    <tfoot><tr><td colspan="7"><input type="checkbox" class="selectAll"><a href="{AnUrl('play_list/admin/do_add_material')}" play-list-id="{$info.id}" class="btn btn-success btn-xs js_add">添加</a></td></tr></tfoot>
  </table>
  {include_core file="admin/lib/pager.html"}
</div>
{load_js file="uploadify/jquery.uploadify.min.js"}
<script>
$(function(){

var new_sort = [];
/*
  $('.js_sort tr').each(function(i){
    old_sort[i] = $(this).attr('id').substring(8);
  });
*/
  $('.js_add').click(function(e){
    e.preventDefault();
    var thisObj = $(this);
    var is_delete = thisObj.attr('is-delete');
    var url = thisObj.attr('href');
    var playListId = thisObj.attr('play-list-id');

    if (is_delete) {
        var ids = thisObj.attr('material-id');
    } else {
        is_delete = 0;
        var ids = getCheckedIds().join(',');
    }

    if (!ids) {
        showMsg('请选择要操作的内容');return false;
    }
    if (!playListId) {
        showMsg('请选择播放单');return false;
    }

    $.post(url, { 'id':ids, 'play-list-id':playListId, 'is_delete':is_delete }, function(json){
        if (json.info != 'ok') {
            showMsg(json.info);return false;
        }
        window.location.href = window.location.href;
    }, 'json');
  });

  // 城市联动
  $('.js_province').change(function(){
    var thisObj = $(this);
    var code = thisObj.find('option:selected').attr('code');
    if (code == 0) {
        $('.js_city').html('<option value="0">全国</option>');
        return ;
    }
    if (code == -1) {
        $('.js_city').html('<option>全部</option>');
        return ;
    }

    //发送ajax
    $.ajax({
      url : 'material/admin/get_city?code='+code,
      success : function(city_list){
        var html = '<option value="0">请选择市</option>';
        for (var i in city_list) {
          html += '<option value="'+city_list[i]['area']+'">'+city_list[i]['area']+'</option>';
          $('.js_city').html(html);
        }
      },
      type : 'get',
      dataType : 'json',
      async : false,
    });
  });

  $('.js_searchBtn').click(function(){
    $('.js_search').submit();
  });

  // 拖拽结束后的回调函数
  function update()
  {
    $('.js_save_sort').removeClass('hidden');

    $('.js_sort tr').each(function(i){
        new_sort[i] = $(this).attr('id').substring(8);
    });
  }
  $('.js_sort').sortable({ axis: 'y', update:update });

  $('.js_save_sort a').click(function(e){
    e.preventDefault();
    var thisObj = $(this);
    var url = thisObj.attr('href');
    var playListId = thisObj.attr('play-list-id');

    if (!playListId) {
        showMsg('保存失败');return false;
    }

    var sort = new_sort.join(',');
    if (!sort) {
        showMsg('保存失败!');return false;
    }

    $.post(url, { 'play_id':playListId, 'sort':sort }, function(json){
        if (json.info != 'ok') {
            showMsg(json.info);return false;
        }
        // 保存成功后执行流程
        showMsg('保存成功', 1);
        $('.js_save_sort').addClass('hidden');
    }, 'json');
  });
});
</script>
{include_core file="admin/lib/footer.html"}